<template>
  <div>
    <h2>理财列表</h2>
    理财名称 <input type="text" v-model="data.F_name">
    利息 <select v-model="data.I_id">
            <option value="0">--请选择--</option>
            <option v-for="i in valt" :value="i.I_id">{{ i.I_name }}</option>
          </select>&nbsp;

          <input type="button" @click="show" value="查询" class="btn btn-primary">
    <table class="table table-bordered">
      <tr>
        <td>理财ID</td>
        <td>理财名称</td>
        <td>年收益</td>
        <td>利息</td>
        <td>最低金额</td>
        <td>理财人次</td>
        <td>风险等级</td>
      </tr>
      <tr v-for="item in list">
        <td>{{ item.F_id }}</td>
        <td>{{ item.F_name }}</td>
        <td>{{ item.F_yearPrice }}</td>
        <td>{{ item.I_name }}</td>
        <td>{{ item.F_mixPrice }}</td>
        <td>{{ item.F_num }}</td>
        <td>{{ item.F_Grade}}</td>
      </tr>
    </table>
    <input type="button" @click="page(1)" value="首页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pageindex-1)" value="上一页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pageindex+1)" value="下一页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pagecount)" value="尾页" class="btn btn-primary">&nbsp;
    <input type="text" v-model="data.pageindex" size="2">&nbsp;
    <input type="button" @click="show" value="Go" class="btn btn-success">
  </div>
</template>
<script  setup lang="ts">
import {ref,onMounted} from 'vue'
import axios from 'axios'

const list =ref([{
  F_id:0,
  F_name:'',
  F_yearPrice:'',
  I_id:'0',
  I_name:'',
  F_mixPrice:0,
  F_num:0,
  F_Grade:0,
}])

const data=ref({
  F_name:'',
  I_id:0,
  pageindex:1,
  pagesize:3,
  count:0,
  pagecount:0
})


const valt=ref([{
  I_id:'',
  I_name:''
}])

onMounted(()=>{
  BackFill()
  show()
})

const page=(num:any)=>{
  if(num>=1&&num<=data.value.pagecount){
    data.value.pageindex=num
    show()
  }
}

const BackFill=()=>{
  axios({
    url:'http://localhost:54566/api/Finance/GetInverestData',
    mathod:'get',
  })
  .then((res)=>{
    valt.value=res.data
  })
  .catch((err)=>{
    console.log(err)
  })
}



const show=()=>{
  axios({
    url:'http://localhost:54566/api/Finance/GetFinanceShow',
    method:'get',
    params:{
      F_name:data.value.F_name,
      I_id:data.value.I_id,
      pageindex:data.value.pageindex,
      pagesize:data.value.pagesize,
    }
  })
  .then((res)=>{
    console.log(res.data)
    list.value=res.data.pageorder
    data.value.count=res.data.count
    data.value.pagecount=res.data.pagecount
  })
  .catch((err)=>{
    console.log(err)
  })
}

</script>
